{% load i18n %}
<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
      var _speedMark = new Date();
      //在js中使用site_url,则这个javascript片段一定要保留
      var site_url = "{{SITE_URL}}";            // app的url前缀,在ajax调用的时候，应该加上该前缀
    </script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>{% trans '用户管理|蓝鲸智云社区版' %}</title>
    <meta name="keywords" content="{% trans '开发者中心,游戏运维,运维,服务器管理,模块配置,监控,腾讯游戏,蓝鲸,智云,devops,运维开发,蓝鲸社区版,社区版,作业平台,集成平台,配置平台,管控平台' %}" />
    <meta name="description" content="{% trans '蓝鲸智云软件社区版是由蓝鲸智云团队提供的一套基于PaaS的技术解决方案，旨在改变中国运维行业，帮助企业快速达到基础运维支撑能力，并提升技术人员的DevOps能力。该版本提供了配置平台，作业平台，集成平台等强大功能，用户在使用时，请查阅并遵守《蓝鲸智云软件用户服务协议》。' %}" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

    <link rel="icon" type="image/x-icon" href="{{STATIC_URL}}favicon.ico">

    <!-- bootstrap CSS 公共样式 -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}assets/bootstrap-3.1.1/css/bootstrap.min.css">
    <!-- 图标 CSS 公共样式 -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}assets/bk-icon-2.0/iconfont.css">
    <!-- select2 插件 -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}assets/select2-3.5.2/select2.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}assets/bkDialog-1.0/css/ui-dialog.css">
    <!-- 顶部导航css 私有样式 -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/layout_head.{{CSS_SUFFIX}}">
    <!-- base 基本样式 -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/base.{{CSS_SUFFIX}}?v={{STATIC_VERSION}}">
    <style>
      html,body{
          height: 100%;
      }
    </style>
</head>

<body>
    <!-- 头部横向导航 start -->
    <div class="head" id="header">

        <div class="head_box">
            <div class="inner wrp">
                <span class="logo_bk">
                    <a title="{% trans '蓝鲸智云工作台' %}" href="/">
                      <img src="{{STATIC_URL}}{% trans 'img/logo/logo_user_01.png' %}"/>
                    </a>
                    <a title="{% trans '蓝鲸智云用户管理' %}" href="{{SITE_URL}}accounts/user/list/">
                      <img src="{{STATIC_URL}}{% trans 'img/logo/logo_user_02.png' %}"/>
                    </a>
                </span>
                <input type='hidden' name='csrfmiddlewaretoken' value='{{csrf_token}}'>
                <div class="account">
                    <div class="account_meta account_info account_meta_primary">
                          <a href="###" class="nickname">
                          {% if request.user %}
                              {{ request.user.username }}
                          {% else %}
                              ''
                          {% endif %}
                          </a>
                          <a href="###">
                            {% if request.user.is_superuser %}
                              <img src="{{STATIC_URL}}img/getadminheadimg.jpg" class="avatar">
                            {% else %}
                              <img src="{{STATIC_URL}}img/getheadimg.jpg" class="avatar">
                            {%  endif %}
                          </a>
                    </div>
                    {% if request.user %}
                        <div class="account_meta account_logout account_meta_primary"><a id="logout" href="{{LOGOUT_URL}}">{% trans '注销' %}</a></div>
                    {% endif %}
                </div>

            </div>
        </div>

    </div>
    <!-- 头部横向导航 end -->
      <!-- 中间主体内容 start -->
      <div id="body" class="body page_index">
          <div id="js_container_box" class="container_box cell_layout side_l">
            {% block body_content %}{% endblock %}
          </div>

          <div id="return_top" class="return_btn return_top" href="#" title="{% trans '返回顶部' %}" style="display:none;">
          <span aria-hidden="true" class="glyphicon glyphicon-chevron-up"></span>
        </div>
        <div id="return_bottom" class="return_btn return_bottom" href="#" title="{% trans '返回底部' %}" style="display:none;">
          <span aria-hidden="true" class="glyphicon glyphicon-chevron-down"></span>
        </div>
      </div>
      <!-- 中间主体内容 end -->
      <!-- 尾部声明 start -->
      <div class="foot" id="footer">
        <ul class="links ft">
            <li>
                <a id="contact_us" class="link">{% trans 'QQ咨询' %}(800802001)</a>
                | <a href="https://bbs.bk.tencent.com/forum.php" target="_blank" hotrep="hp.footer.feedback" class="link">{% trans '蓝鲸论坛' %}</a>
                | <a href="https://bk.tencent.com/" target="_blank" hotrep="hp.footer.feedback" class="link">{% trans '蓝鲸官网' %}</a>
                | <a href="/" target="_blank" hotrep="hp.footer.feedback" class="link">{% trans '蓝鲸智云工作台' %}</a>
            </li>
            <li><p class="copyright">Copyright © 2012-{{NOW.year}} Tencent BlueKing. All Rights Reserved.</p> </li>
          <li><p class="copyright">{% trans '蓝鲸智云 版权所有' %}</p> </li>
        </ul>
      </div>
      <!-- 尾部声明 end -->
      <!-- js 国际化 -->
      <script type="text/javascript" src="{{SITE_URL}}jsi18n/i18n/"></script>
      <!-- jQery库 公共脚本 -->
      <script src="{{STATIC_URL}}assets/jquery-1.8.2.min.js"></script>
      <!-- bootstrap JS 公共脚本 -->
      <script src="{{STATIC_URL}}assets/bootstrap-3.1.1/js/bootstrap.min.js"></script>
      <!-- dialog -->
      <script src="{{STATIC_URL}}assets/bkDialog-1.0/js/dialog.js"></script>
      <!-- select2 -->
      <script src="{{STATIC_URL}}assets/select2-3.5.2/select2.js"></script>
      <script src="{{STATIC_URL}}js/csrftoken.{{JS_SUFFIX}}"></script>
      <!--[if lt IE 9]>
        <script src="{{STATIC_URL}}assets/html5shiv-3.7.2.min.js"></script>
        <script src="{{STATIC_URL}}assets/respond-1.4.2.min.js"></script>
      <![endif]-->
      <!-- 兼容性设置 -->
      <!--[if lt IE 6]>\xe8\x93\x9d\xe9\xb2\xb8\xe6\x99\xba\xe8\x90\xa5\x20\xe7\x89\x88\xe6\x9d\x83\xe6\x89\x80\xe6\x9c\x89<![endif]-->
      <script type="text/javascript">
      /**
     * 页面滚动条
     */
      var minHeight = 100;
      var scrollOffset = $(document).height()-$(window).height() - 100;
      var returnTopDom = $('#return_top');
      var returnBottomDom = $('#return_bottom');

      //确定按钮位置
      function setBtnPosition(){
        var returnTopLeft = $('#body').offset().left + $('#body').width() + 10;
        if ($(window).width() >= returnTopLeft) {
          $('.return_btn').css({'left': returnTopLeft+'px'});
        } else {
          $('.return_btn').css({'left': 'auto', 'right': '10px', 'position': 'fixed'});
        }
      }
      //监听滚动条
      $(window).on('scroll',function(){
        var sTop = $(this).scrollTop();
        if (sTop > minHeight){
          returnTopDom.fadeIn(300);
        }else{
          returnTopDom.fadeOut(300);
        }

        if (sTop >= scrollOffset){
          returnBottomDom.fadeOut(300);
        }else{
          returnBottomDom.fadeIn(300);
        }
      });

      //监听窗口resize
      $(window).on('resize',function(){
        setBtnPosition();
      });

      //返回顶部
      returnTopDom.on('click',function(){
        $('html,body').animate({scrollTop:0},700);
        return false;
      });
      returnBottomDom.on('click',function(){
        $('html,body').animate({scrollTop:scrollOffset+100},700);
        return false;
      });
      setBtnPosition();
      $(window).trigger('scroll');
    </script>
    {% block script %}{% endblock %}
</body>
</html>
